<#include "/common/layout.html">
<@body>
<body class="gray-bg">
	<div class="wrapper">
	  	<section class="content">
			<div class="row">
				<div class="col-xs-12">
					<div class="box">
						<div class="form-inline">
							<div class="box-header">
								<div class="input-group input-group-sm">
									<input type="text" name="search_value" id="search_value" class="form-control" placeholder="名称查询">
									<div class="input-group-btn">
										<a href="javascript:;" id="search_data" class="btn btn-default" ><i class="fa fa-search"></i> 搜索</a>
										<a href="javascript:;" id="search_refresh" class="btn btn-default"><i class="fa fa-refresh"></i> 重置</a>
									</div>
								</div>
							</div>
						</div>
						<div class="box-body">
							<table id="order_initTable" class="table table-bordered table-hover"></table>
						</div>
					</div>
				</div>
			</div>
	  	</section>
	</div>
</body>
</@body>
<script>
	$(function(){
		global_val.displayStart = GetQueryValue("_iDisplayStart");
		if(!global_val.displayStart){
			global_val.displayStart = 0;
		}
　　	initTable();
	});
	var global_val = {
		displayStart: 0
	}
	var query_data = {
		search: ''
	}
	//搜索
	$("#search_data").off().on("click", function() {
		query_data.search = $("#search_value").val();
		reloadTable();
	});
	//重置
	$("#search_refresh").off().on("click", function() {
		query_data.search = "";
		$("#search_value").val("");
		reloadTable();
	});
	//重新加载表格
	function reloadTable() {
		var oSetting = data_oTable.settings()[0];
		oSetting.ajax.data = query_data;
		data_oTable.draw();
	}
	//渲染表格
	function initTable() {
		var options = {
			id: "order_initTable",
			lengthMenu: [5, 10, 20, 50],
			pageLength: 5,
			displayStart: global_val.displayStart,
			ajax: {
				url: "/mall/order/listPage",
				type: "POST",
				data: query_data,
			},
			columnDefs: [{
				targets: 0,
				title: "",
				orderable: !1,
				width: "300px",
				render: function(e, a, t, n) {
					var htmls = '' 
					htmls += '<div>'
					htmls += '	<div class="pull-left">'+ $.table.imageSquareView(t.picUrl) +'</div>'
					htmls += '	<div class="pull-left">'
					htmls += '		<div style="margin: 5px 0px 10px 10px;">下单时间：'+ t.createTime +'</div>'
					htmls += '		<div style="margin: 5px 0px 10px 10px;">订单编号：'+ t.orderSn +'</div>'
					htmls += '		<div style="margin: 5px 0px 10px 10px;">商品总数：共计'+ t.number +'件商品</div>'
					htmls += '	</div>'
					htmls += '</div>'
					return htmls;
				}
			},{
				targets: 1,
				title: "付款",
				orderable: !1,
				render: function(e, a, t, n) {
					return t.orderPrice;
				}
			},{
				targets: 2,
				title: "卖家信息",
				orderable: !1,
				render: function(e, a, t, n) {
					var htmls = '' 
						htmls += '<div>'
						htmls += '	<div style="margin: 5px 0px 10px 10px;">收货人名称：'+ t.consignee +'</div>'
						htmls += '	<div style="margin: 5px 0px 10px 10px;">收货人电话：'+ t.mobile +'</div>'
						htmls += '</div>'
					return htmls;
				}
			},{
				targets: 3,
				title: "交易状态",
				orderable: !1,
				render: function(e, a, t, n) {
					var payStatus = '<span class="label label-warning">待付款</span>'; 
					if(t.payStatus == 1){
						payStatus = '<span class="label label-success">已付款</span>'; 
					}
					var shipStatus = '<span class="label label-warning">待发货</span>';
					if(t.shipStatus != 0){
						shipStatus = '<span class="label label-success">已发货</span>';
					}
					var receviedStatus = '<span class="label label-warning">待收货</span>';
					if(t.shipStatus == 2){
						receviedStatus = '<span class="label label-success">已收货</span>';
					}
					var htmls = '' 
						htmls += '<div>'
						htmls += '	<div style="margin: 5px 0px 10px 10px;">付款状态：'+ payStatus +'</div>'
						htmls += '	<div style="margin: 5px 0px 10px 10px;">发货状态：'+ shipStatus +'</div>'
						htmls += '	<div style="margin: 5px 0px 10px 10px;">收货状态：'+ receviedStatus +'</div>'
						if(t.orderStatus == 0){
							htmls += '<div style="margin: 5px 0px 10px 10px;">'
							htmls += '	订单状态：<span class="label label-danger">已取消</span>'
							htmls += '</div>'
						}
						htmls += '</div>'
					return htmls;
				}
			},{
				targets: 4,
				title: "物流信息",
				orderable: !1,
				render: function(e, a, t, n) {
					var shipSn = t.shipSn == null ? "无" : t.shipSn;
					var shipChannel = t.shipChannel == null ? "无" : t.shipChannel;
					var htmls = '' 
						htmls += '<div>'
						htmls += '	<div style="margin: 5px 0px 10px 10px;">快递单号：'+ shipSn +'</div>'
						htmls += '	<div style="margin: 5px 0px 10px 10px;">快递公司：'+ shipChannel +'</div>'
						htmls += '</div>'
					return htmls;
				}
			},{
				targets: 5,
				title: "操作",
				orderable: !1,
				render: function(e, a, t, n) {
					var html = '';
						html += '<div>'
						<#if shiro.hasPermission("listOrder")>
							html += '	<a class="btn btn-primary btn-xs" href="javascript:void(0);" onclick="detail('+ t.orderId +')" title="详情"><i class="fa fa-search"></i>详情</a>'
						</#if>
						html += '</div>';
					return html;
				}
			}]
		};
		//渲染表格
		data_oTable = $.table.init(options);
	}
	function detail(orderId){
		global_val.displayStart = data_oTable.settings()[0]._iDisplayStart;
		window.location.href = "/mall/order/detail/" + orderId + "?_iDisplayStart="+global_val.displayStart;
	}
</script>
